<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>vue中过滤器的定义及使用</title>
    <script src="../lib/vue.js"></script>
</head>
<body>
    <!--过滤器只能用在插值表达式和v-bind中-->
    <div id="app">
        {{msg | msgFormat('老有所成') | appendMsg('雨后有车驶来,','驶过暮色苍白。') }}
    </div>

    <script>
        //定义过滤器
        //格式：  过滤器的名称，函数（第一个参数是当前元素的值，后面是过滤器中传进的参数）
        Vue.filter('msgFormat',function(msg,arg1){
            return msg.replace(/年少有为/g,arg1);
        });
        //插值表达式中可以使用多个过滤器
        Vue.filter('appendMsg',function(msg,arg1,arg2){
            return msg + arg1 + arg2;
        });


        var vue = new Vue({
            el: '#app',
            data:{
                msg: '假如我年少有为，不自卑。假如我年少有为，知进退。'
            }
        });

    </script>
</body>
</html>